import { ref, defineAsyncComponent, markRaw } from 'vue';

let componentNameList:Array<string> = []

const modules = import.meta.glob('./**/*.vue');
//  debugger
//这告诉 TypeScript，components.value 是一个键为字符串、值为 defineAsyncComponent 返回类型的对象。
const componentList = ref<Record<string, ReturnType<typeof defineAsyncComponent>>>({});
 Object.entries(modules).forEach(([path, asyncCom]:any) => {
    // console.log([path, asyncCom])
    const name = path.replace(/.*\/(.*).vue$/, '$1');
    componentList.value[name] = markRaw(defineAsyncComponent(asyncCom));
    componentNameList.push(name)
});

// const componentNameKey = Object.keys(componentList.value)

export { componentList, componentNameList }


//注册到全局
// const GlobalComponents = (app: App<Element>) => {
//     Object.entries(modules).forEach(([path, asyncCom]:any) => {
//         const name = path.replace(/.*\/(.*).vue$/, '$1');
//         app.component(`${name}`, markRaw(defineAsyncComponent(asyncCom)));
//     });
// }

// export default GlobalComponents



